import { FC, useEffect } from 'react'
import { useRouterHook } from './hooks'
// Page: react组件
// option={title:'页面标题',requireLogin:'访问权限， 是否需要登录'}
export function wapper(Page: FC, option: { title: string, requireLogin: boolean }) {
    return (props: any) => {
        const { navigate } = useRouterHook()
        // 动态设置页面标题
        if (option.title) {
            document.title = option.title
        }
        // 表示页面需要登录才能访问
        if (option.requireLogin) {
            // 检测登录状态
            const { token } = JSON.parse(localStorage.getItem('userLoginInfo') || '{}')
            // 没有登录
            if (!token) {
                // 自动导航到登录页面
                useEffect(() => {
                    navigate('/login')
                }, [])
            }
        }
        return <Page {...props} />
    }
}